/* =====================================================================
   CORRECTIONS DE LISIBILITÉ (thème clair + P7 en thème sombre)
   Feuille chargée EN DERNIER sur chaque page publique.
   Objectif : contraste WCAG AA (4,5:1 texte courant, 3:1 gros titres).
   Couleurs du thème clair : bleu #0A1172 (titres), doré foncé #8a6500
   (sur blanc) et #7a5900 (sur fonds teintés), bleu #2f4fc4 (accents).
   ===================================================================== */

/* ---------------------------------------------------------------------
   0. « Flou » des cartes en thème clair
   .card::before (style.css) = halo flouté (filter: blur + ombre interne
   sombre) qui voile le bord des cartes sur fond clair. On garde un léger
   dégradé net, sans flou ni ombre grise.
   --------------------------------------------------------------------- */
body.light-mode .card::before {
    filter: none;
    box-shadow: none;
    background: linear-gradient(135deg, rgba(65, 105, 225, 0.05), rgba(255, 215, 0, 0.04));
}
body.light-mode .card:hover::before { filter: none; }

/* ---------------------------------------------------------------------
   P2. Titres du pied de page (jaune #FFD700 sur blanc)
   --------------------------------------------------------------------- */
body.light-mode footer h3,
body.light-mode footer .footer-section h3,
body.light-mode footer h3.footer-title {
    color: #0A1172 !important;
    text-shadow: none;
}

/* ---------------------------------------------------------------------
   P3. Devise + icônes de navigation blanches dans l'en-tête non défilé,
   sur les pages SANS bannière sombre (actualités, à propos, formations,
   album, sondages, contact, connexion…). Les pages avec bannière sombre
   (accueil .hero, équipe .hero, pages 80 ans .a80-hero) gardent le blanc.
   --------------------------------------------------------------------- */
body.light-mode:not(.a80-page):not(:has(> section.hero:not(.about-hero))) > header:not(.scrolled) .logo span,
body.light-mode:not(.a80-page):not(:has(> section.hero:not(.about-hero))) > header:not(.scrolled) nav a,
body.light-mode:not(.a80-page):not(:has(> section.hero:not(.about-hero))) > header:not(.scrolled) nav a i {
    color: #0A1172;
    text-shadow: none;
}
/* Pages de connexion (login / changer-mot-de-passe) */
body.light-mode.login-page {
    background: #f4f6f8;
}
body.light-mode.login-page header .logo span {
    color: #0A1172;
    text-shadow: none;
}
/* Sur les bannières sombres, ombre portée nette (pas de halo flou) */
body.light-mode > header:not(.scrolled) .logo span {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* ---------------------------------------------------------------------
   P4 + cartes d'actualités (index + actualites) en thème clair :
   l'en-tête de carte devient clair (dégradé translucide) mais les textes
   restaient blancs / jaunes.
   --------------------------------------------------------------------- */
body.light-mode .news-grid .card .card-header,
body.light-mode .news-grid .card .card-header > span:not(.news-date),
body.light-mode .news-grid .card .card-header .meta .name {
    color: #0A1172 !important;
}
body.light-mode .news-grid .card .card-header .meta .text-muted,
body.light-mode .news-grid .card .card-header .text-muted {
    color: #4a4f6e !important;
}
body.light-mode .news-grid .card .card-header .news-date {
    color: #2f4fc4 !important;
}
body.light-mode .news-grid .card .card-header .meta .news-date {
    color: #7a5900 !important;
}
body.light-mode .news-grid .card .caption {
    color: #1a1a2e !important;
}
body.light-mode .news-grid .card a.btn-read-more-link {
    color: #7a5900 !important;
    font-weight: 600;
}
body.light-mode .news-grid .card .actions .action-btn,
body.light-mode .news-grid .card .likes {
    color: #0A1172 !important;
}
body.light-mode .news-grid .card .actions .action-btn.liked {
    color: #c2185b !important;
}
body.light-mode .news-grid .card .comments-count {
    color: #4a4f6e !important;
}

/* ---------------------------------------------------------------------
   P5. Aperçu des sondages (index) : texte blanc sur carte blanche
   --------------------------------------------------------------------- */
body.light-mode .poll-facebook,
body.light-mode .poll-facebook strong,
body.light-mode .poll-facebook .poll-title,
body.light-mode .poll-facebook .count {
    color: #1a1a2e;
}
body.light-mode #poll-preview .poll-facebook strong {
    color: #0A1172;
}
body.light-mode .poll-facebook .poll-option button.option-btn {
    color: #0A1172;
    border-color: rgba(10, 17, 114, 0.25);
    background: #ffffff;
}
body.light-mode .poll-facebook .progress {
    background: rgba(10, 17, 114, 0.1);
}

/* ---------------------------------------------------------------------
   P6. Boutons de filtre inactifs (équipe, album) : blanc sur fond clair
   --------------------------------------------------------------------- */
body.light-mode .filter-wrapper .filter-btn:not(.active):not(:hover) {
    color: #0A1172;
    background: #ffffff;
    border-color: #4169e1;
}

/* ---------------------------------------------------------------------
   P7 (THÈME SOMBRE). Titres h4 des cartes (formations) : bleu #0A1172 sur
   carte bleu nuit. En sombre, on les passe en doré.
   --------------------------------------------------------------------- */
body:not(.light-mode) .card .card-body h4 {
    color: var(--gold);
}

/* Titre + texte posés sur la photo assombrie du bandeau formations
   (voile noir 50-70 %) : le titre passait en #1a1a2e en thème clair. */
body.light-mode .hero-formations .hero-content .section-title,
body.light-mode .hero-formations .hero-content .formations-intro,
body.light-mode .hero-formations .hero-content .formations-intro p {
    color: #ffffff !important;
}

/* ---------------------------------------------------------------------
   P8. Formulaire de contact en thème clair : fond bleu translucide qui
   rendait les libellés bleu foncé illisibles. Fond clair, libellés bleus.
   --------------------------------------------------------------------- */
body.light-mode .contact-form .contact-form-inner {
    background: #ffffff;
    backdrop-filter: none;
    border: 1px solid rgba(10, 17, 114, 0.12);
}
body.light-mode #contact-form .form-group label,
body.light-mode #contact-form label.consent-label {
    color: #0A1172 !important;
}
body.light-mode #contact-form .form-group input,
body.light-mode #contact-form .form-group textarea {
    border-color: rgba(10, 17, 114, 0.28) !important;
}
/* Page contact : le voile noir à 70 % (fixe, toute la page) rendait le
   titre « Nous Contacter » (bleu nuit) illisible. Voile clair en thème clair. */
body.light-mode.contact-page::after {
    background: rgba(244, 246, 248, 0.9);
}

/* Placeholders trop pâles en thème clair (formulaires publics) */
body.light-mode .form-group input::placeholder,
body.light-mode .form-group textarea::placeholder,
body.light-mode .search-wrapper input::placeholder,
body.light-mode #news-search::placeholder {
    color: #5f6380;
    opacity: 1;
}
body.light-mode.login-page .login-card input::placeholder {
    color: rgba(10, 17, 114, 0.68);
    opacity: 1;
}
body.light-mode.login-page .login-subtitle,
body.light-mode.login-page .remember-label,
body.light-mode.login-page .footer-bottom {
    color: rgba(10, 17, 114, 0.85);
}

/* ---------------------------------------------------------------------
   P9 + page À propos en thème clair
   - les panneaux .about-content gardaient leur fond quasi noir (::after)
     alors que le texte passait en bleu nuit ;
   - titres dorés #FFD700 sur fond clair (dont un style inline) ;
   - dates de la frise historique en jaune.
   --------------------------------------------------------------------- */
body.light-mode .about-content::after {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: none;
}
body.light-mode .about-content h3,
body.light-mode .about-text h3 {
    color: #0A1172 !important;
}
body.light-mode .about-content .mission-list li {
    background: rgba(10, 17, 114, 0.04);
    color: #0A1172;
}
body.light-mode .about-text strong {
    color: #2f4fc4;
}
body.light-mode .admin-history h3,
body.light-mode .admin-history > h2 {
    color: #0A1172 !important;
}
body.light-mode .timeline-content .timeline-date,
body.light-mode .timeline-date {
    color: #8a6500 !important;
}
body.light-mode .timeline-grade {
    opacity: 1;
    color: #2a2f7a;
}

/* Bandeau « Notre Équipe Pédagogique » : titre bleu nuit posé sur la photo
   assombrie (voile noir 60 %). Titre en blanc. */
body.light-mode:not(.sub-page):not(.login-page) > section.hero h1 {
    color: #ffffff;
}

/* ---------------------------------------------------------------------
   P10. Fonction des membres (« PROVISEUR »…) en jaune sur carte blanche
   --------------------------------------------------------------------- */
body.light-mode .team-member .member-info .role {
    color: #7a5900;
    font-weight: 600;
}
body.light-mode .team-member .member-info .bio {
    opacity: 1;
}

/* ---------------------------------------------------------------------
   80 ans (anniversaire80.css) en thème clair
   --a80-gold #b8860b = 3,25:1 sur blanc (petits textes dorés, boutons
   pleins à texte blanc). On fonce le doré ; sur le bloc d'accueil teinté
   (index) on descend encore d'un cran.
   --------------------------------------------------------------------- */
body.light-mode {
    --a80-gold: #8a6500;
    --a80-gold-line: rgba(138, 101, 0, 0.4);
}
body.light-mode .a80-home {
    --a80-gold: #7a5900;
}
/* P11. Bouton plein « Informations » du héros (fond #f4c542) : texte bleu */
body.light-mode .a80-hero .a80-btn--solid,
body.light-mode .a80-hero .a80-btn:hover,
body.light-mode .a80-hero .a80-btn:focus-visible {
    color: #0a1172;
}
